<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>提现账户管理</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>

</head>
<body style="background-color:white;">
<div id="blank" class="header">
    <div id="back" v-back.tapmode class="back"></div>
    <span class="title">提现账户管理</span>
</div>
<div id="app" class="main-container" v-cloak>
    <div class="accounts-container">
        <div class="accounts-container-single">
            <div class="accounts-single-top">
                <img v-src="'../../image/accounts_icon_alipay.png'">
                <span>支付宝帐号</span>
                <a class="nobind" v-if="!ali_account.length" v-open-win.tapmode vurl="bindAlipay">
                    绑定
                    <img class="accounts-arrow" v-src="'../../image/arrow_right_yellow.png'">
                </a>
                <a class="bind" v-if="ali_account.length" v-myclick="['支付宝帐号', _unbind]" >
                    解绑
                    <img class="accounts-arrow" v-src="'../../image/arrow_right_grey.png'">
                </a>
            </div>
            <div class="accounts-single-bottom1" :class="BSImg" v-if="!ali_account.length">
                未绑定支付宝
            </div>
            <div class="accounts-single-bottom2 ali" :class="BSImg" v-if="ali_account.length">
                <p>{{ali_account[0].ali_realname}}</p>
                <p>{{ali_account[0].ali_account}}</p>
            </div>
        </div>
        <div class="accounts-container-single">
            <div class="accounts-single-top">
                <img v-src="'../../image/accounts_icon_bank.png'">
                <span>银行卡</span>
                <a class="nobind" v-if="!bank_account.length" v-open-win.tapmode vurl="bindCard">
                    绑定
                    <img class="accounts-arrow" v-src="'../../image/arrow_right_yellow.png'">
                </a>
                <a class="bind" v-if="bank_account.length" v-myclick="['银行卡', _unbind]" tapmode>
                    解绑
                    <img class="accounts-arrow" v-src="'../../image/arrow_right_grey.png'">
                </a>
            </div>
            <div class="accounts-single-bottom1" :class="BSImg" v-if="!bank_account.length">
                未绑定银行卡
            </div>
            <div class="accounts-single-bottom2 bank" :class="BSImg" v-if="bank_account.length">
                <p><span>{{bank_account[0].bank_realname}}</span><span style="float:right;font-size:12px;margin-right:15px;vertical-align: baseline">{{bank_account[0].bank_name}}{{bank_account[0].bank_branch}}</span></p>
                <p>{{bank_account[0].bank_card}}</p>
            </div>
        </div>
        <!--<div class="accounts-container-single">-->
            <!--<div class="accounts-single-top">-->
                <!--<img src="../../image/icon_home.png">-->
                <!--<span>微信帐号</span>-->
                <!--<a class="nobind" v-if="!wechatBind" v-open-win vurl="bindWechat">绑定></a>-->
                <!--<a class="bind" v-if="wechatBind" @click="_unbind('微信帐号')">解绑></a>-->
            <!--</div>-->
            <!--<div class="accounts-single-bottom1" v-if="!wechatBind">-->
                <!--未绑定微信-->
            <!--</div>-->
            <!--<div class="accounts-single-bottom2" v-if="wechatBind">-->
                <!--<p>赵平</p>-->
                <!--<p>15858585888</p>-->
            <!--</div>-->
        <!--</div>-->
    </div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script>

    var vm;
    var blank;

    var ali_account;
    var bank_account;

    apiready = function () {
        setBSImg();
        blank = new Vue({
            el:'#blank'
        });
        showProgress();

        var data = {
            member_id : getPrefs('member_id')
        };
        var callback = function (ret) {
            ali_account = ret.content.ali_account;
            bank_account = ret.content.bank_account;
            initApp();
            api.parseTapmode();
        };
        pinet.post(URL.getAccounts, data, callback);

        addListeners();
    };

    function initApp() {
        var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data:{
                ali_account:ali_account,
                bank_account:bank_account,
                BSImg:{
                    big:isBigImg,
                    small:!isBigImg
                }
            },
            methods:{
                _unbind:function (type) {
                    api.confirm({
                        title: '提示',
                        msg: '解绑后不能提现至该'+type+',是否解绑？',
                        buttons: ['解绑','取消']
                    }, function (ret, err) {
                        if(ret.buttonIndex == 1) {
                            if(type == '支付宝帐号'){
                                vm.unbind(1);
                            }else if(type == '银行卡'){
                                vm.unbind(2);
                            }
                        }
                    });
                },
                unbind: function (type) {
                    var data = {
                        member_id : getPrefs('member_id'),
                        type:type
                    };
                    var callback = function (ret) {
                        switch(type){
                            case 1:
                                vm.ali_account = [];
                                break;
                            case 2:
                                vm.bank_account = [];
                                break;
                        }
                    };
                    pinet.post(URL.delAccount, data, callback);
                }
            }
        })
    }

    function addListeners() {
        api.addEventListener({
            name: 'bindAccounts'
        }, function () {
            window.location.reload();
        });

        api.addEventListener({
            name: 'viewappear'
        }, function () {
            onPageStart();
        });

        api.addEventListener({
            name: 'viewdisappear'
        }, function () {
            onPageEnd();
        });

        api.addEventListener({
            name: 'keyback'
        }, function () {
            onPageEnd();
            api.closeWin();
        });
    }

</script>
</html>
